

@import '../../styles/theme.scss';

$height: 88px;

// 自定义搜索框样式
.at-search-bar {
	position: relative;
	width: 666px;
	padding: 0 12px 0 4px;
	margin: 0 auto;
	border: none;
	background: none;

	&::after {
		border: none;
	}
	&__input-cnt {
		height: $height;
		background: #f2f2f2;
		border-radius: 10px;
	}

	&__placeholder-wrap {
		height: $height;
		padding: 0 12px;
		color: $darkGrey;
		font-size: $heading-4-size;

		.at-icon {
			color: $darkGrey;
			font-size: $heading-4-size;
		}
	}

	&__placeholder {
		margin-left: 12px;
		color: $darkGrey;
		font-size: $heading-4-size;
	}

	// 搜索框 输入框 部分
	&__input {
		height: $height !important;
		padding: 0 46px;
		color: $title;
		// color: #e8e8e9;
		font-size: $heading-4-size !important;
	}

	// 搜索框 清除按钮
	&__clear {
		right: 24px;
		height: $height;
		width: 25px;
		color: $darkGrey;
		font-size: $heading-3-size;

		.at-icon-close-circle {
			z-index: 99;
		}
	}

	// 搜索框 搜索 按钮
	&__action {
		height: $height;
		line-height: $height;
		padding: 0 20px;
		margin-left: 20px;

		color: $white;
		font-size: $heading-5-size;
		border-radius: 8px;
		background-color: $orange;
	}
}
